<template>
	<view class="technician-pages-order" :style="{background:pageColor}">

		<block v-if="!configInfo.plugAuth.coachport">
			<abnor type="NOT_AUTH" :isCenter="true"></abnor>
		</block>
		<block v-if="configInfo.plugAuth.coachport">


			<view class="fix" style="top:-100%;left:-100%">
				<block v-for="(item,index) in order_unix_list" :key="index">
					<block v-if="item.id === recorder_order_id">
						<min-countdown :targetTime="item.start_service_time_unix * 1000"
							@callback="toCountDownEnd(item.id)"> </min-countdown>
					</block>
				</block>
			</view>
			<fixed>
				<tab @change="handerTabChange" :list="tabList" :activeIndex="activeIndex*1" :activeColor="primaryColor"
					:numberType="3" :textBold="true" fontSize="32rpx" color="#999" lineClass="little"
					:width="100/tabList.length + '%'" height="100rpx">
				</tab>
			</fixed>

			<view @tap.stop="goDetail(index)" class="list-item fill-base radius-16" v-for="(item,index) in list.data"
				:key="index">
				<view class="nav-title flex-between f-paragraph"
					:class="[{'danger':item.pay_type==2},{'warning':item.pay_type>2&&item.pay_type<6},{'success':item.pay_type==6}]">
					<view class="flex-y-center text-bold"><i class="iconfont iconshijian5 text-normal mr-sm"></i> 预约
						{{item.start_time}}
					</view>
					<view>{{statusType[item.pay_type]}}</view>
				</view>
				<view style="padding:0 28rpx">
					<view class="flex-between f-paragraph pt-md"
						v-if="item.store_id || configInfo.plugAuth.store || item.abn_order_id">
						<view>
							<view class="c-title" v-if="item.store_id || configInfo.plugAuth.store">
								{{item.store_id ? '到店服务':'上门服务'}}
							</view>
						</view>
						<view>
							<view class="abnormal-btn flex-center f-icontext" v-if="item.abn_order_id">订单异常</view>
						</view>
					</view>

					<view class="flex-between f-paragraph c-title pt-md mb-md"
						v-for="(aitem,aindex) in item.order_goods" :key="aindex">
						<view class="flex-between" style="width:85%">
							<view class="f-title text-bold ellipsis"
								:class="[{'max-400':!aitem.refund_num},{'max-300':aitem.refund_num>0}]">
								{{aitem.goods_name}}
							</view>
							<view class="flex-y-center">
								<view class="c-warning mr-sm" v-if="aitem.refund_num>0">已退x{{aitem.refund_num}}</view>
								<view><span class="font-num">¥</span>{{aitem.price}}</view>
							</view>
						</view>
						<view>x{{aitem.num}}</view>
					</view>
					<view class="count-list flex-center mt-lg">
						<view class="count-item">
							<view class="flex-y-baseline f-mini-title font-num">¥<view class="f-md-title">
									{{item.pay_price}}
								</view>
							</view>
							<view class="f-desc c-caption">订单金额</view>
						</view>
						<view class="count-item">
							<view class="flex-y-baseline f-mini-title font-num">¥<view class="f-md-title">
									{{item.coach_cash || 0}}
								</view>
							</view>
							<view class="f-desc c-caption">预估收益</view>
						</view>
						<view class="count-item">
							<view class="flex-y-baseline f-mini-title font-num" v-if="item.car_type ==1">
								¥
								<view class="f-md-title">
									{{item.car_price || 0}}
								</view>
							</view>
							<view class="f-desc c-caption" v-if="item.car_type ==1">车费</view>
						</view>
					</view>

					<view class="flex-between pt-lg pb-lg">
						<view class="flex-y-center f-paragraph c-title"><i class="iconfont"
								:class="[{'icontaxi': item.car_type==1},{'iconbus':item.car_type!==1}]"
								:style="{color:item.car_type==1?'#43A960':'#FF791A',fontSize:'36rpx'}"></i>
							<view style="margin: 0 4rpx;">{{item.car_type ==1 ?'出租车':'公交/地铁'}}</view>
							<view v-if="item.car_type == 1">{{item.distance}}</view>
						</view>
						<view class="flex-warp">
							<!-- // pay_type 2待接单，5待服务，6服务中，7已完成 -->
							<!-- 待接单 -->
							<block v-if="item.pay_type == 2">
								<view @tap.stop="toRefuse(index)" class="oper-btn sm flex-center f-mini-title c-title">
									拒单
								</view>
								<view @tap.stop="toConfirm(index,3)" class="oper-btn flex-center f-mini-title c-base"
									:style="{background:primaryColor,borderColor:primaryColor}">接单</view>
							</block>
							<!-- 待服务 -->
							<block v-if="[3,4,5].includes(item.pay_type)">
								<view @tap.stop="toTel(index)" class="oper-btn flex-center f-mini-title"
									:style="{color:primaryColor,borderColor:primaryColor}">联系客户</view>
								<view
									@tap.stop="toConfirm(index, item.is_add || item.store_id ? 6 : item.pay_type*1+1 )"
									class="oper-btn flex-center f-mini-title c-base"
									:style="{background:primaryColor,borderColor:primaryColor}">
									{{item.is_add || item.store_id ? '开始服务' : item.pay_type == 3 ? '确认出发': item.pay_type == 4 ?'拍照打卡' : '开始服务'}}
								</view>
							</block>
							<!-- 服务中 -->
							<block v-if="item.pay_type == 6">
								<view @tap.stop="toTel(index)" class="oper-btn flex-center f-mini-title"
									:style="{color:primaryColor,borderColor:primaryColor}">联系客户</view>
								<view @tap.stop="toConfirm(index,7)" class="oper-btn flex-center f-mini-title c-base"
									:style="{background:primaryColor,borderColor:primaryColor}">结束打卡
								</view>
							</block>
							<!-- 已完成 -->
							<block v-if="item.pay_type == 7">
								<view class="flex-center rel">
									<view @tap.stop="toShowMore(index)" class="flex-center f-mini-title c-caption">
										更多
									</view>
									<block v-if="item.is_show_more">
										<view class="show-more-tag abs"></view>
										<view class="show-more-info f-paragraph pl-md pr-md abs"
											:style="{right:item.label_time?'-30rpx':''}">
											<view @tap.stop="toShield(index)" class="more-item flex-center b-1px-b"
												v-if="item.can_shield">
												拉黑用户</view>
											<view @tap.stop="toChangeItem(index,'del_item')"
												class="more-item flex-center">删除订单
											</view>
										</view>
									</block>
								</view>
								<view @tap.stop="toLabel(index)" class="oper-btn flex-center f-mini-title c-base"
									:style="{color:primaryColor,borderColor:primaryColor}" v-if="!item.label_time">评价客户
								</view>
							</block>
						</view>
					</view>
				</view>
			</view>

			<load-more :noMore="list.current_page>=list.last_page&&list.data.length>0" :loading="loading"
				v-if="loading">
			</load-more>
			<abnor v-if="!loading&&list.data.length<=0&&list.current_page==1" :isCenter="true"
				:tip="[{text: '暂无订单数据'}]">
			</abnor>
			<view class="space-max-footer"></view>
			<view :style="{height: `${configInfo.tabbarHeight}px`}"></view>
			<longbingbing-tabbar tabType="coachTabBar" :cur="2"></longbingbing-tabbar>
		</block>

		<common-popup @confirm="confirmOperItem" ref="del_item" type="DELETE_ORDER" :info="popupInfo"></common-popup>

		<uni-popup ref="refuse_item" type="center" :custom="true">
			<view class="common-popup-content fill-base pd-lg radius-34">
				<view class="title">拒绝接单</view>
				<view class="desc">请确认是否拒接接单</view>
				<textarea v-model="coach_refund_text" class="pd-lg textarea f-desc c-title mt-lg radius-20"
					maxlength="200" placeholder="请输入拒单原因" placeholder-class="f-desc c-caption"></textarea>
				<view class="flex-center mt-md" style="width: 540rpx">
					<view class="flex-1"></view>
					<view>{{coach_refund_text.length>200?200:coach_refund_text.length}}/200</view>
				</view>
				<view class="button">
					<view @tap.stop="$refs.refuse_item.close()" class="item-child">取消</view>
					<view @tap.stop="confirmRefuse" class="item-child c-base"
						:style="{background: primaryColor,color:'#fff'}">确定</view>
				</view>
			</view>
		</uni-popup>

		<uni-popup ref="oper_item" type="center" :custom="true">
			<view class="common-popup-content fill-base pd-lg radius-34">
				<view class="title">{{popupInfo.title}}</view>
				<view class="desc">
					温馨提示：定位需要5秒左右才能返回结果，<span style="color: #F13F26;">若打卡位置与您实际位置不符，请使用手动搜索位置获取定位</span>
				</view>
				<view class="space-sm"></view>
				<view class="flex-warp mt-md" style="width: 100%;" v-if="popupInfo.type !== 4">
					<view>拍照打卡：</view>
					<view class="flex-1">
						<upload @upload="imgUpload" @del="imgUpload" :imagelist="popupInfo.imgs" filetype="picture"
							imgtype="imgs" text="拍摄图片" :imgsize="1" :sourceType="2">
						</upload>
					</view>
				</view>
				<view class="flex-warp mt-md" style="width: 100%;" v-if="popupInfo.location">
					<view>当前地点：</view>
					<view class="flex-1"
						:class="[{'c-title':popupInfo.location.address},{'c-caption':!popupInfo.location.address}]">
						<span v-if="popupInfo.location.address">{{popupInfo.location.address}}</span>
						<span v-else>{{popupInfo.isLoca ? '定位失败,请选择手动定位':'定位中请耐心等待'}}</span>
						<span @tap.stop="toChooseLocation" class="c-warning ml-sm" v-if="popupInfo.isLoca">手动定位</span>
					</view>
				</view>
				<!-- #ifdef H5 -->
				<view @tap.stop="$refs.show_location_item.open()" class="flex-y-center f-paragraph mt-md"
					style="width:100%;color:#5a677e">
					定位失败或不准确时您可以这样操作<i class="iconfont iconwentifankui3 ml-sm" style="font-size:28rpx;"></i>
				</view>
				<!-- #endif -->
				<view class="button">
					<view @tap.stop="$refs.oper_item.close()" class="item-child">取消</view>
					<view @tap.stop="confirmOper" class="item-child c-base"
						:style="{background: primaryColor,color:'#fff'}">确定</view>
				</view>
			</view>
		</uni-popup>

		<longbingbing-location-fail ref="show_location_item"></longbingbing-location-fail>

		<uni-popup ref="shield_item" type="center" :custom="true">
			<view class="common-popup-content fill-base pd-lg radius-34">
				<view class="title">温馨提示</view>
				<view class="desc">拉黑客户之后，该客户将不能在列表看到您的信息，会影响你的接单，可以在{{$t('action.attendantName')}}端 -
					拉黑客户页面移除拉黑客户，确认拉黑吗？</view>
				<view class="button">
					<view @tap.stop="$refs.shield_item.close()" class="item-child">我再想想</view>
					<view @tap.stop="confirmShield" class="item-child c-base"
						:style="{background: primaryColor,color:'#fff'}">确定</view>
				</view>
			</view>
		</uni-popup>

		<!-- #ifdef H5 -->
		<block v-if="configInfo.plugAuth.recording && configInfo.service_recording_show">
			<media-recorder ref="recorder" @success='handlerSuccess' @save="handlerOnSave"
				@error='handlerError'></media-recorder>
		</block>
		<!-- #endif -->

		<!-- #ifdef MP-WEIXIN -->
		<user-privacy ref="user_privacy" :show="false"></user-privacy>
		<!-- #endif -->

	</view>
</template>

<script>
	import {
		mapState,
		mapActions,
		mapMutations
	} from "vuex"
	import longbingbingLocationFail from "@/components/longbingbing-location-fail.vue"
	// #ifdef H5
	import MediaRecorder from '@/components/media-recorder.vue'
	// #endif
	// #ifndef H5
	var recorderManager = null
	// #endif
	export default {
		components: {
			longbingbingLocationFail,
			// #ifdef H5
			MediaRecorder
			// #endif
		},
		data() {
			return {
				options: {},
				activeIndex: 1,
				tabList: [],
				statusType: {
					2: '待接单',
					3: '已接单',
					4: '已出发',
					5: '已到达',
					6: '服务中',
					7: '已完成',
					8: '待转单'
				},
				param: {
					page: 1,
					pay_type: 0,
				},
				list: {
					data: []
				},
				loading: true,
				index: -1,
				coach_refund_text: '',
				lockTap: false,
				popupInfo: {
					title: '',
					type: '',
					index: '',
					param: {},
					imgs: [],
					isLoca: false,
					location: {
						lat: 0,
						lng: 0,
						address: ''
					}
				},
				// #ifndef H5
				isReset: false,
				duration_time: 600
				// #endif
			}
		},
		computed: mapState({
			configInfo: state => state.config.configInfo,
			isUserMedia: state => state.order.isUserMedia,
			recorder: state => state.order.recorder,
			recorder_status: state => state.order.recorder_status,
			recorder_order_id: state => state.order.recorder_order_id,
			order_unix_list: state => state.order.order_unix_list,
		}),
		async onLoad(options) {
			this.options = options
			let {
				tab = 1
			} = options
			this.activeIndex = tab
			let {
				hide_order_info
			} = this.configInfo
			this.tabList = hide_order_info ? [{
				title: '待接单',
				id: 2,
				number: 0
			}, {
				title: '待服务',
				id: 5,
				number: 0
			}, {
				title: '服务中',
				id: 6,
				number: 0
			}] : [{
				title: '全部',
				id: 0
			}, {
				title: '待接单',
				id: 2,
				number: 0
			}, {
				title: '待服务',
				id: 5,
				number: 0
			}, {
				title: '服务中',
				id: 6,
				number: 0
			}, {
				title: '已完成',
				id: 7,
				number: 0
			}]
			this.initIndex()
		},
		// #ifdef H5
		destroyed() {
			// #endif
			// #ifndef H5
			onUnload() {
					// #endif
					this.toUnload()
				},
				async onPullDownRefresh() {
						// #ifndef APP-PLUS
						uni.showNavigationBarLoading()
						// #endif
						this.initRefresh();
						uni.stopPullDownRefresh()
					},
					onReachBottom() {
						if (this.list.current_page >= this.list.last_page || this.loading) return;
						this.param.page = this.param.page + 1;
						this.loading = true;
						this.getList();
					},
					methods: {
						...mapActions(['getConfigInfo', 'toPlayAudio']),
						...mapMutations(['updateUserItem', 'updateOrderItem']),
						async initIndex(refresh = false) {
							if (!this.configInfo.id || refresh || !this.userInfo.id) {
								await this.getConfigInfo()
							}
							await this.getList()
							this.$util.setNavigationBarColor({
								bg: '#ffffff',
								color: '#000000'
							})
							if (refresh) return
							// #ifndef H5
							recorderManager = uni.getRecorderManager()
							//开始录音
							recorderManager.onStart(() => {
								this.$util.log('开始录音')
							})
							//结束录音
							recorderManager.onStop((res) => {
								this.$util.log('结束录音', res)
								this.handlerOnSave(res)
								let {
									duration
								} = res
								let currentTime = parseInt(duration / 1000)
								let isReset = this.duration_time * 1 - currentTime > 1 ? false : true
								this.isReset = isReset
								if (isReset) {
									this.handlerOnChanger()
								}
							})
							// 录音异常
							recorderManager.onError((e) => {
								this.$util.log('录音异常', e)
							})
							// #endif

							// #ifdef MP-WEIXIN
							let privacyCheck = this.$refs.user_privacy.check()
							if (privacyCheck) {
								this.$refs.user_privacy.open()
								return
							}
							await this.$util.checkAuth({
								type: 'userLocationBackground',
								tip: '需要获取您当前的位置信息，请在位置信息中选择'
							})
							// #endif

							// #ifdef H5
							if (!refresh) {
								let {
									status: coach_status = 0,
									coach_position = 0
								} = this.userCoachStatus
								if (coach_position && coach_status == 2) {
									this.$util.getCoachUtilLoca()
									this.$jweixin.hideOptionMenu()
								} else {
									this.$jweixin.initJssdk(() => {
										this.$jweixin.hideOptionMenu()
									})
								}
							}
							// #endif
						},
						initRefresh() {
							uni.pageScrollTo({
								duration: 0,
								scrollTop: 0
							})
							this.param.page = 1
							this.initIndex(true)
						},
						async getList(flag = false) {
							let {
								list: oldList,
								param,
								tabList,
								activeIndex
							} = this
							param.pay_type = tabList[activeIndex].id
							let newList = await this.$api.technician.orderList(param)
							newList.data.map(item => {
								item.is_show_more = false
							})

							let arr = newList.data.filter(aitem => {
								return aitem.pay_type > 6
							})
							if (arr.length > 0) {
								let ids = arr.map(aitem => {
									return aitem.id
								})
								let {
									order_unix_list
								} = this
								let unix_list = order_unix_list.filter(aitem => {
									return !ids.includes(aitem.id)
								})
								if (unix_list.length !== order_unix_list.length) {
									this.updateOrderItem({
										key: 'order_unix_list',
										val: unix_list
									})
								}
							}

							if (!flag) {
								if (this.param.page == 1) {
									this.list = newList
								} else {
									newList.data = oldList.data.concat(newList.data)
									this.list = newList
								}
							}
							let {
								hide_order_info
							} = this.configInfo
							let tabInd = hide_order_info ? 0 : 1

							this.tabList[tabInd].number = newList.agent_order_count
							this.tabList[tabInd + 1].number = newList.wait_order_count
							this.tabList[tabInd + 2].number = newList.service_order_count
							this.loading = false
							this.$util.hideAll()
						},
						handerTabChange(index) {
							this.activeIndex = index;
							uni.pageScrollTo({
								scrollTop: 0
							})
							this.param.page = 1;
							this.getList()
						},
						async toUnload() {
							this.updateOrderItem({
								key: 'recorder_status',
								val: false
							})
							this.updateOrderItem({
								key: 'recorder_order_id',
								val: 0
							})
						},
						// 开始录音
						async handlerOnChanger() {
							// #ifdef MP-WEIXIN
							let privacyCheck = this.$refs.user_privacy.check()
							if (privacyCheck) {
								this.$refs.user_privacy.open()
								return
							}
							// #endif
							// #ifndef H5
							await this.$util.checkAuth({
								type: "record"
							});
							// #endif
							let {
								recorder_status,
								duration_time
							} = this
							if (recorder_status) {
								// #ifdef H5
								this.$refs.recorder.stop()
								// #endif
								// #ifndef H5
								recorderManager.stop()
								// #endif
							} else {
								// #ifdef H5
								this.$refs.recorder.start()
								// #endif
								// #ifndef H5
								recorderManager.start({
									format: 'mp3',
									duration: duration_time * 1000,
								})
								// #endif
							}
							this.updateOrderItem({
								key: 'recorder_status',
								val: !recorder_status
							})
						},
						async handlerOnEnd() {
							// #ifdef H5
							this.$refs.recorder.stop()
							setTimeout(() => {
								this.handlerOnSave()
							}, 1000)
							// #endif
							// #ifndef H5
							recorderManager.stop()
							// #endif
							this.updateOrderItem({
								key: 'recorder_status',
								val: false
							})
						},
						async handlerOnSave(res = {}) {
							this.$util.showLoading({
								title: `录音上传中`
							})
							let filePath = ''
							// #ifdef H5
							let unix = parseInt(new Date().getTime() / 1000)
							let name = `服务过程录音-${unix}.mp3`
							let {
								data
							} = this.recorder
							let file = new File([data], name, {
								type: 'audio/mp3'
							})
							filePath = URL.createObjectURL(file)
							// #endif
							// #ifndef H5
							let {
								tempFilePath,
							} = res
							filePath = tempFilePath
							// #endif

							let {
								attachment_path: link
							} = await this.$api.base.uploadFile({
								filePath,
								formData: {
									type: 'audio'
										// #ifdef H5
										,
									name
									// #endif
								}
							})

							let {
								recorder_order_id: order_id
							} = this
							await this.$api.technician.recordingAdd({
								order_id,
								link
							})
							this.$util.hideAll()
						},
						// #ifdef H5
						handlerSuccess(res) {
							this.updateOrderItem({
								key: 'recorder',
								val: res
							})
						},
						handlerError(code) {
							switch (code) {
								case '101':
									uni.showModal({
										content: '当前浏览器版本较低，请更换浏览器使用，推荐在微信中打开。'
									})
									break;
								case '201':
									uni.showModal({
										content: '麦克风权限被拒绝，请刷新页面后授权麦克风权限。'
									})
									break
								default:
									uni.showModal({
										content: '未知错误，请刷新页面重试'
									})
									break
							}
						},
						// #endif 
						// 服务倒计时结束
						async toCountDownEnd(id) {
							let {
								recorder_status,
								recorder_order_id
							} = this
							if (recorder_order_id == id && recorder_status) {
								let data = await this.$api.technician.orderInfo({
									id
								})
								let {
									total_time_long: time_long,
									start_service_time = ''
								} = data
								let unix = Math.ceil(((this.$util.DateToUnix(start_service_time) + time_long * 60) *
									1000 -
									new Date().getTime()) / 1000)
								if (unix < 1) {
									await this.handlerOnEnd()
									// #ifdef H5
									this.$refs.recorder.clear()
									// #endif
								}
							}
						},
						// 拒绝接单
						async toRefuse(index) {
							this.index = index
							this.coach_refund_text = ''
							this.$refs.refuse_item.open()
						},
						// 确认：拒绝接单
						async confirmRefuse() {
							let {
								coach_refund_text
							} = this
							coach_refund_text = coach_refund_text.length > 0 ? coach_refund_text.replace(
								/(^\s*)|(\s*$)/g,
								"") : ''
							if (coach_refund_text.length == 0) {
								this.$util.showToast({
									title: `请输入拒单原因`
								})
								return
							}
							this.coach_refund_text = this.coach_refund_text.substring(0, 200)
							let {
								index,
							} = this
							this.toConfirm(index, -1)
						},
						// 获取定位
						async toGetLocation() {
							this.popupInfo.isLoca = false
							this.popupInfo.location = {
								isIp: false,
								lat: 0,
								lng: 0,
								address: ''
							}
							this.$util.showLoading({
								title: '定位中'
							})
							try {
								let {
									lat,
									lng
								} = await this.$util.getCoachUtilLoca(false)
								this.initUtilLocaData(lat, lng, false)
							} catch (e) {
								console.log(e, "=====catch e")
								let {
									lat,
									lng
								} = await this.$util.getLocation()
								this.initUtilLocaData(lat, lng, false)
							}
						},
						async initUtilLocaData(lat, lng, isIp) {
							if (!lat && !lng) {
								this.popupInfo.isLoca = true
								this.$util.hideAll()
								return
							}
							let {
								address
							} = await this.$util.getMapAddr({
								lat,
								lng
							})
							let location = {
								lat,
								lng,
								address
							}
							if (!isIp) {
								this.$util.updateCoachAddr(location)
							}
							let data = Object.assign({}, this.popupInfo, {
								isLoca: true,
								location
							})
							this.$nextTick(() => {
								this.popupInfo = data
							})
							this.$util.hideAll()
						},
						imgUpload(e) {
							let {
								imagelist,
								imgtype
							} = e;
							this.popupInfo[imgtype] = imagelist;
						},
						// 选择地区
						async toChooseLocation() {
							// #ifdef APP-PLUS
							if (plus.os.name == 'Android' && plus.navigator.checkPermission(
									'android.permission.ACCESS_FINE_LOCATION') ===
								'undetermined') {
								this.$refs.app_check_item.open()
							} else {
								this.toConfirmChooseLoca()
							}
							// #endif
							// #ifndef APP-PLUS
							this.toConfirmChooseLoca()
							// #endif
						},
						async toConfirmChooseLoca() {
							// #ifdef MP-WEIXIN
							let privacyCheck = this.$refs.user_privacy.check()
							if (privacyCheck) {
								this.$refs.user_privacy.open()
								return
							}
							// #endif 

							let {
								lat,
								lng,
								address,
								name
							} = await this.$util.chooseLocation()
							if (!lat && !lng) return
							if (name && !address) {
								this.$util.showToast({
									title: `请选择具体的地址`
								})
								return
							}
							this.popupInfo.location = {
								map_type: 1,
								isIp: false,
								lat,
								lng,
								address: `${address} ${name}`
							}
						},
						// 确认： 4已出发/5已到达/7已完成
						async confirmOper() {
							let popupInfo = this.$util.deepCopy(this.popupInfo)
							let {
								index,
								type,
								param,
								imgs,
								location,
							} = popupInfo

							let {
								lat = 0, lng = 0
							} = location
							if ([5, 7].includes(type) && imgs.length === 0) {
								this.$util.showToast({
									title: `请先拍照`
								})
								return
							}
							if (!lat && !lng) {
								this.toGetLocation()
								return
							}
							if ([5, 7].includes(type)) {
								let {
									path
								} = imgs[0]
								location.path = path
							}
							this.toConfirmUpdate(index, type, param, location)
						},
						// type: -1拒绝接单，3确定接单，4已出发，5已到达，6开始服务，7已完成
						async toConfirm(index, type) {
							if (this.lockTap) return
							let {
								id: order_id,
							} = this.list.data[index]
							order_id = order_id * 1
							let param = {
								order_id,
								type
							}
							if (type == -1) {
								param.coach_refund_text = this.coach_refund_text
							}
							if ([4, 5, 7].includes(type)) {
								let arr = {
									4: '确认出发',
									5: '拍照打卡',
									7: '结束打卡',
								}
								let title = arr[type]
								this.popupInfo = Object.assign({}, this.popupInfo, {
									title,
									index,
									type,
									param,
									imgs: [],
									isLoca: false,
									location: {
										lat: 0,
										lng: 0,
										address: ''
									}
								})
								this.$refs.oper_item.open()
								this.toGetLocation()
							} else {
								this.toConfirmUpdate(index, type, param)
							}
						},
						async toConfirmUpdate(index, type, param, location = {}) {
							if ([4, 5, 7].includes(type)) {
								let {
									lat,
									lng,
									address,
									path,
									map_type = 0
								} = location
								param.map_type = map_type
								if (type === 4) {
									param.serout_lat = lat
									param.serout_lng = lng
									param.serout_address = address
								}
								if (type == 5) {
									param.arrive_img = path
									param.arr_lat = lat
									param.arr_lng = lng
									param.arr_address = address
								}
								if (type == 7) {
									param.end_img = path
									param.end_lat = lat
									param.end_lng = lng
									param.end_address = address
								}
							}
							let msg = {
								'-1': '已拒绝接单',
								3: '接单成功',
								4: '已成功出发',
								5: '已成功到达',
								6: '已开始服务',
								7: '服务已完成'
							}
							if (this.lockTap) return
							this.lockTap = true

							let {
								plugAuth,
								service_recording_show
							} = this.configInfo
							let {
								recording
							} = plugAuth

							let {
								isUserMedia,
								recorder_order_id,
								recorder_status
							} = this

							// #ifndef H5
							isUserMedia = 1
							// #endif

							let flag = true

							let {
								order_id
							} = param

							let order_info = {}
							try {
								order_info = await this.$api.technician.orderInfo({
									id: order_id
								})
							} catch (e) {
								if (type == -1) {
									this.$refs.refuse_item.close()
								}
								if ([4, 5, 7].includes(type)) {
									this.$refs.oper_item.close()
								}
								this.param.page = 1
								this.getList()
								this.lockTap = false
								this.$util.hideAll()
								return
							}

							let {
								pay_type
							} = order_info

							if (pay_type == 7 && recorder_order_id == order_id && recorder_status) {
								await this.handlerOnEnd()
								// #ifdef H5
								this.$refs.recorder.clear()
								// #endif
							}

							if (pay_type < type && type === 6 && recorder_order_id != order_id && recorder_status) {
								let [res_del, {
									confirm
								}] = await uni.showModal({
									title: '提示',
									content: "已有开始的服务还未结束录音，请确认是否完成录音并开始新的服务？"
								})
								if (confirm) {
									await this.handlerOnEnd()
									// #ifdef H5
									this.$refs.recorder.clear()
									// #endif
								} else {
									flag = false
								}
							}

							this.$util.showLoading()

							if (!flag) {
								this.lockTap = false
								this.$util.hideAll()
								return
							}

							try {
								if (type == -1) {
									this.$refs.refuse_item.close()
								}
								if ([4, 5, 7].includes(type)) {
									this.$refs.oper_item.close()
								}
								await this.$api.technician.updateOrder(param)
								if (type == 4 || type == 5) {
									this.list.data[index].pay_type = type
									this.updateOrderItem({
										key: type == 4 ? 'coach_travel_order_id' : 'coach_travel_arrive_id',
										val: order_id
									})
								} else {
									this.list.data.splice(index, 1)
								}
								if (type == 6) {
									this.toPlayAudio({
										key: 'service_start_recording'
									})
									if (isUserMedia && recording && service_recording_show) {
										this.$util.hideAll()
										await uni.showModal({
											title: '提示',
											content: "服务过程将自动录音，直至服务结束！若录音中退出页面将不会记录录音的音频！",
											showCancel: false,
											confirmText: '知道了'
										})
										this.updateOrderItem({
											key: 'recorder_order_id',
											val: order_id
										})
										this.handlerOnChanger()
									}
									let {
										total_time_long: time_long,
										start_service_time
									} = await this.$api.technician.orderInfo({
										id: order_id
									})
									let start_service_time_unix = this.$util.DateToUnix(start_service_time) +
										time_long * 60

									let unix_items = {
										id: order_id,
										time_long,
										start_service_time,
										start_service_time_unix
									}
									let {
										order_unix_list
									} = this
									let unixInd = order_unix_list.findIndex(item => {
										return item.id === order_id
									})
									if (unixInd != -1) {
										order_unix_list[unixInd] = unix_items
									} else {
										order_unix_list.push(unix_items)
									}
									this.updateOrderItem({
										key: 'order_unix_list',
										val: order_unix_list
									})
								}
								if (type == 7) {
									if (recorder_order_id == order_id && recorder_status) {
										await this.handlerOnEnd()
										// #ifdef H5
										this.$refs.recorder.clear()
										// #endif
									}
								}
								this.$util.hideAll()
								this.$util.showToast({
									title: msg[type]
								})
								await this.getList(true)
								this.updateOrderItem({
									key: 'haveOperItem',
									val: true
								})
								setTimeout(() => {
									this.lockTap = false
								}, 500)
							} catch (e) {
								this.updateOrderItem({
									key: 'haveOperItem',
									val: true
								})
								setTimeout(() => {
									this.param.page = 1
									this.getList()
									this.lockTap = false
									this.$util.hideAll()
								}, 2000)
							}
						},
						toShowMore(index) {
							let {
								id
							} = this.list.data[index]
							this.list.data.map(item => {
								item.is_show_more = item.id == id ? true : false
							})
						},
						// 删除订单
						async toChangeItem(index, refs_key) {
							if (this.lockTap) return
							this.list.data[index].is_show_more = false
							let {
								id,
								order_code,
								order_goods,
							} = this.list.data[index]
							let {
								goods_cover: image,
							} = order_goods[0]
							this.popupInfo = {
								id,
								name: `单号：${order_code}`,
								image,
								index,
								refs_key
							}
							this.$refs[refs_key].open()
						},
						// 确认：删除订单
						async confirmOperItem() {
							let {
								id,
								index,
								refs_key,
							} = this.popupInfo
							let methodArr = {
								'del_item': ['delOrder', '删除成功', -1]
							}
							let methodModel = methodArr[refs_key][0]
							let title = methodArr[refs_key][1]
							if (this.lockTap) return
							this.lockTap = true
							try {
								this.$refs[refs_key].close()
								await this.$api.technician[methodModel]({
									id
								})
								this.list.data.splice(index, 1)
								this.$util.showToast({
									title
								})
								setTimeout(() => {
									if (refs_key == 'del_item' && this.list.data.length < 5) {
										this.initRefresh()
									}
									this.lockTap = false
								}, 1000)
							} catch (e) {
								setTimeout(() => {
									this.getList(1)
									this.lockTap = false
								}, 2000)
							}
						},
						// 屏蔽用户
						toShield(index) {
							this.index = index
							this.list.data[index].is_show_more = false
							let {
								block_user_type = 1
							} = this.configInfo
							if (block_user_type == 1) {
								this.$refs.shield_item.open()
								return
							}
							this.$util.goUrl({
								url: `/userA/pages/feedback/box?blockuser=1&index=${index}`
							})
						},
						// 确认：屏蔽用户
						async confirmShield() {
							let {
								index
							} = this
							if (this.lockTap) return;
							this.lockTap = true;
							this.$util.showLoading()
							let {
								user_id
							} = this.list.data[index]
							try {
								await this.$api.technician.shieldUserAdd({
									user_id
								})
								this.$util.hideAll()
								this.$refs.shield_item.close()
								this.$util.showToast({
									title: `屏蔽成功`
								})
								this.initRefresh()
								setTimeout(() => {
									this.lockTap = false
								}, 1000)
							} catch (e) {
								setTimeout(() => {
									this.lockTap = false
									this.$util.hideAll()
								}, 2000)
							}
						},
						// 联系客户
						async toTel(index) {
							let {
								id
							} = this.list.data[index]
							let url = await this.$api.technician.getVirtualPhone({
								order_id: id
							})
							if (!url) {
								this.$util.showToast({
									title: `稍后会有电话打入，请注意接听哦`
								})
								return
							}
							this.$util.goUrl({
								url,
								openType: `call`
							})
						},
						// 订单详情
						goDetail(index) {
							let {
								id
							} = this.list.data[index]
							this.list.data[index].is_show_more = false
							let url = `/technician/pages/order/detail?id=${id}`
							this.$util.goUrl({
								url
							})
						},
						toLabel(index) {
							let {
								id,
								user_id
							} = this.list.data[index]
							this.list.data[index].is_show_more = false
							this.$util.goUrl({
								url: `/technician/pages/order/label?id=${id}&uid=${user_id}`
							})
						}
					}
		}
</script>


<style lang="scss">
	.technician-pages-order {
		.list-item {
			margin: 20rpx 28rpx 0 28rpx;
			box-shadow: 0px 2px 20px 0px rgba(0, 0, 0, 0.05);

			.nav-title {
				width: 100%;
				height: 90rpx;
				padding: 0 28rpx;
				border-radius: 16rpx 16rpx 0 0;
				color: #999999;
				background: linear-gradient(270deg, rgba(153, 153, 153, 0) 0%, rgba(153, 153, 153, 0.15) 100%);

				.iconfont {
					font-size: 36rpx;
				}
			}

			.danger {
				color: #FF4000;
				background: linear-gradient(270deg, rgba(255, 64, 0, 0) 0%, rgba(255, 64, 0, 0.15) 99%);
			}

			.warning {
				color: #FF9500;
				background: linear-gradient(270deg, rgba(255, 149, 0, 0) 0%, rgba(255, 149, 0, 0.15) 100%);
			}

			.success {
				color: #009900;
				background: linear-gradient(270deg, rgba(0, 153, 0, 0) 0%, rgba(0, 153, 0, 0.15) 100%);
			}

			.abnormal-btn {
				width: 108rpx;
				height: 40rpx;
				background: #FFEBE5;
				border-radius: 6rpx;
				color: #FF4000;
			}

			.count-list {
				width: 100%;
				height: 130rpx;
				background: #FAFAFA;
				border-radius: 18rpx;
				padding-left: 28rpx;

				.count-item {
					width: 37%;

					.flex-y-baseline {
						margin: 4rpx 0 6rpx 0;

						.f-md-title {
							margin-left: 5rpx;
						}
					}
				}

				.count-item:nth-child(3) {
					width: 26%
				}
			}

			.oper-btn {
				width: 174rpx;
				height: 72rpx;
				border-radius: 36rpx;
				border: 1rpx solid #fff;
			}

			.oper-btn.sm {
				width: 124rpx;
				border: 1rpx solid #999;
			}

			.oper-btn:nth-child(2) {
				margin-left: 20rpx;
			}
		}
	}

	.show-more-tag {
		width: 20rpx;
		height: 20rpx;
		top: 70rpx;
		left: 50%;
		margin-left: -10rpx;
		background: #FFFFFF;
		transform: rotate(45deg);
		box-shadow: 0 0 4px 4px rgba(222, 222, 222, 0.37);
		z-index: 99990;
	}

	.show-more-info {
		top: 80rpx;
		right: -71rpx;
		width: 200rpx;
		background: #FFFFFF;
		box-shadow: 0px 6px 16px 0px rgba(222, 222, 222, 0.37);
		border-radius: 8px;
		border: 1px solid #F5F5F5;
		z-index: 99999;

		.more-item {
			padding: 24rpx 0;
		}
	}
</style>